<template>
  <DialogPopUp
    title="企业信息"
    @cancel-click="cancelClick"
    @reset-click="resetClick"
    @save-click="saveClick"
  >
    <div class="banner">
      <div>
        <span :class="{ active: showForm }" @click="tabClick(1)">单&nbsp;位</span>
        <span :class="{ active: showForm === false }" @click="tabClick(2)">附&nbsp;件</span>
      </div>
    </div>

    <!-- 表单 -->
    <div v-if="showForm">
      <!-- 单位基本信息 -->
      <div class="jbxxForm">
        <Title :title-info="basicInfo" />
        <el-form :model="basicInfoForm" label-width="90px">
          <!-- <el-form-item label="企业名称">
            <el-input v-model="basicInfoForm.qymc" disabled />
          </el-form-item> -->
          <div
            style="color: #fff; font-size: 18px; display: flex; height: 30px; margin-bottom: 10px"
          >
            <P style="padding: 0 10px">企业名称</P>
            <P style="flex: 1; padding: 3px 0 0 15px">{{ qymccopy }}</P>
          </div>
          <el-row :gutter="50">
            <el-col :span="12">
              <el-form-item label="所属园区">
                <el-select v-model="basicInfoForm.yqid" placeholder="请选择">
                  <el-option
                    v-for="item in yqOptions"
                    :key="item.value"
                    :label="item.text"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="企业简称">
                <el-input v-model.trim="basicInfoForm.qyjc" />
              </el-form-item>
            </el-col>
          </el-row>

          <el-form-item label="企业地址">
            <el-input v-model.trim="basicInfoForm.qydz" />
          </el-form-item>
          <el-form-item label="经营范围">
            <el-input v-model.trim="basicInfoForm.jyfw" />
          </el-form-item>

          <el-row :gutter="50">
            <el-col :span="12">
              <el-form-item label="产业类型">
                <el-select
                  v-model="basicInfoForm.cylx"
                  placeholder="请选择"
                  @change="selectHandler"
                >
                  <el-option
                    v-for="item in CYLXOptions"
                    :key="item.zddm"
                    :label="item.zdmc"
                    :value="item.zddm"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="成立时间">
                <el-date-picker
                  v-model="basicInfoForm.clsh"
                  type="year"
                  placeholder="请选择"
                  :default-value="new Date()"
                  value-format="YYYY"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-form-item label="产业链" class="cylclass">
            <el-select v-model="basicInfoForm.cylList" clearable multiple style="width: 100%">
              <el-option
                v-for="item in cylOptions"
                :key="item.zddm"
                :label="item.zdmc"
                :value="item.zddm"
              />
            </el-select>
            <!-- <el-input v-model.trim="basicInfoForm.cyl" /> -->
          </el-form-item>

          <el-form-item class="zdwxy" label="是否是危险化学品重大危险源">
            <el-select v-model="basicInfoForm.sfzdwxy" style="width: 100%">
              <el-option label="是" value="1" />
              <el-option label="否" value="0" />
            </el-select>
          </el-form-item>

          <el-form-item class="jghggy" label="是否是重点监管化工工艺">
            <el-select v-model="basicInfoForm.sfzdgy" style="width: 100%">
              <el-option label="是" value="1" />
              <el-option label="否" value="0" />
            </el-select>
          </el-form-item>

          <el-form-item class="wxhxp" label="是否是重点监管危险化学品">
            <el-select v-model="basicInfoForm.sfzdhxp" style="width: 100%">
              <el-option label="是" value="1" />
              <el-option label="否" value="0" />
            </el-select>
          </el-form-item>

          <el-form-item label="备注">
            <el-input v-model.trim="basicInfoForm.bz" />
          </el-form-item>
        </el-form>
      </div>

      <!-- 联系人 -->
      <div class="lxrxxForm">
        <Title :title-info="contactInfo" />
        <el-form
          ref="ruleFormRef"
          :model="lxrInfoForm"
          :rules="rules"
          class="dialog-from"
          status-icon
        >
          <div
            v-for="(item, index) in lxrInfoForm.list"
            :key="item.id"
            style="margin-bottom: -10px"
          >
            <el-row>
              <el-col :span="24">
                <el-form-item :label="item.ryzw" style="margin-bottom: 0"></el-form-item>
              </el-col>
            </el-row>
            <el-row style="margin-left: 5px; margin-bottom: 10px" :gutter="10">
              <el-col :span="8">
                <el-form-item label="姓名" :prop="`list.${index}.rymc`" :rules="rules.rymc">
                  <el-input v-model.trim="item.rymc" style="width: 90%" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="手机" :prop="`list.${index}.ryyddh`" :rules="rules.ryyddh">
                  <el-input v-model.trim="item.ryyddh" style="width: 90%" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="值班电话" :prop="`list.${index}.ryzbdh`" :rules="rules.ryzbdh">
                  <el-input v-model.trim="item.ryzbdh" style="width: 100%" />
                </el-form-item>
              </el-col>
            </el-row>
          </div>
        </el-form>
      </div>
    </div>
    <!-- 表单 -->

    <!-- 上传附件 -->
    <div v-else>
      <uploadqy
        ref="fileupload"
        :upload-title="uploadTitle"
        @upload-success="uploadCuccess"
        @uploadDelete="uploadDelete"
      />
    </div>
    <!-- 上传附件 -->
  </DialogPopUp>
</template>

<script lang="ts" setup>
import { reactive } from 'vue'
import type { FormInstance, FormRules } from 'element-plus' //用来重置表单
import Title from '@/components/Title/index.vue'
import uploadqy from '@/components/uploadqy/index.vue'
import { queryContactInfo, insertOrUpdatefjxx, queryfjList, querycyl } from '@/service/api'
import {
  queryQyxxInfo,
  insertOrUpdateQyxx,
  insertOrUpdateLxrxx,
  queryZdZdmcInfo,
  queryyqList,
} from '@/service/api'
import { checkNumberTypeAndLength } from '@/utils/common'
import { ElMessage } from 'element-plus'
import { useChemicalStore } from '@/store'

import DialogPopUp from '@/components/DialogPopUp/index.vue'
import { emitter } from '@/composables'
const CYLXOptions = ref()
const tabType = ref(1)
// 基本信息
const basicInfoForm = ref({
  yqid: '',
  qyjc: '',
  qydz: '',
  jyfw: '',
  cylx: '',
  clsh: '',
  cylMcList: [],
  cylList: [],
  sfzdwxy: '1',
  sfzdgy: '1',
  sfzdhxp: '1',
  bz: '',
})
const chemicalStore = useChemicalStore()
const fileupload = ref()
const yqOptions = ref()
const emit = defineEmits(['uploadHandler'])
//联系人信息
const props = defineProps({
  qyContactInfo: {
    type: Array,
    default: () => {},
  },
})
const cylOptions = ref()
const qyContactInfo = ref([])
const fjxxInfoList = ref([])
const qymccopy = ref('')
const lxrInfoFormLest = reactive({
  list: [
    {
      ryzw: '法人',
      rymc: '',
      ryyddh: '',
      ryzbdh: '',
      rysx: '2',
      id: '',
    },
    {
      ryzw: '企业负责人',
      rymc: '',
      ryyddh: '',
      rysx: '1',
      ryzbdh: '',
      id: '',
    },
    {
      ryzw: '安全负责人',
      rymc: '',
      ryyddh: '',
      ryzbdh: '',
      rysx: '3',
      id: '',
    },
    {
      ryzw: '生产调度责任人',
      rymc: '',
      ryyddh: '',
      ryzbdh: '',
      rysx: '4',
      id: '',
    },
    {
      ryzw: '消防安全管理人',
      rymc: '',
      ryyddh: '',
      ryzbdh: '',
      rysx: '6',
      id: '',
    },
    {
      ryzw: '消防安全责任人',
      rymc: '',
      ryyddh: '',
      ryzbdh: '',
      rysx: '5',
      id: '',
    },
  ],
})
const lxrInfoFormmc = reactive([
  {
    ryzw: '法人',
  },
  {
    ryzw: '企业负责人',
  },
  {
    ryzw: '安全负责人',
  },
  {
    ryzw: '生产调度责任人',
  },
  {
    ryzw: '消防安全管理人',
  },
  {
    ryzw: '消防安全责任人',
  },
])
const lxrInfoForm = reactive({
  list: [
    {
      ryzw: '法人',
      rymc: '',
      ryyddh: '',
      ryzbdh: '',
      rysx: '2',
      id: '',
    },
    {
      ryzw: '企业负责人',
      rymc: '',
      ryyddh: '',
      ryzbdh: '',
      rysx: '1',
      id: '',
    },
    {
      ryzw: '安全负责人',
      rymc: '',
      ryyddh: '',
      ryzbdh: '',
      id: '',
      rysx: '3',
    },
    {
      ryzw: '生产调度责任人',
      rymc: '',
      ryyddh: '',
      rysx: '4',
      ryzbdh: '',
      id: '',
    },
    {
      ryzw: '消防安全管理人',
      rymc: '',
      ryyddh: '',
      ryzbdh: '',
      rysx: '6',
      id: '',
    },
    {
      ryzw: '消防安全责任人',
      rymc: '',
      ryyddh: '',
      ryzbdh: '',
      rysx: '5',
      id: '',
    },
  ],
})
//时间值
const value = ref('')

const basicInfo = ref('基本信息')
const contactInfo = ref('联系人信息')
const uploadTitle: any = ref([
  // { title: '平面图', zddm:1, fjxxInfoListsf: [] },
  // { title: '四色风险图', fjxxInfoListsf: [] },
  // { title: '消防系统图', fjxxInfoListsf: [] },
  // { title: '企业文档', fjxxInfoListsf: [] },
  // { title: '历史事故案例', fjxxInfoListsf: [] },
])

emitter.on('qy_refreshData', () => {
  queryQyxxInfoFrom()
})

//附件类型
function queryxk() {
  const arr: any = [
    {
      zddm: '1',
      title: '平面图包括厂区平面图和除去在罐区、装置、堆场、仓库、火炬中已经上传的其他平面图；',
      title1: '附件最大不得超过500MB；',
      title2: 'JPG/PNG/PDF',
    },
    {
      zddm: '2',
      title: '工艺图包含厂区总工艺图和除去装置中已经上传的其他工艺图；',
      title1: '附件最大不得超过500MB；',
      title2: 'JPG/PNG/PDF',
    },
    {
      zddm: '3',
      title: '风险四色图包含厂区四色风险图及其他四色风险图',
      title1: '附件最大不得超过500MB；',
      title2: 'JPG/PNG/PDF',
    },
    {
      zddm: '4',
      title: '消防系统图包含消防给排水系统图、消防电系统图及其他消防系统图；',
      title1: '附件最大不得超过500MB；',
      title2: 'JPG/PNG/PDF',
    },
    {
      zddm: '5',
      title:
        '企业文档包含企业初步设计、企业安评报告、企业环评报告、企业消防安全专篇、企业事故应急救援专篇、企业预案；',
      title1: '500MB；',
      title2: 'DOC/DOCX/PDF',
    },
    {
      zddm: '6',
      title: '历年事故案例包含历年事故案例',
      title1: '附件最大不得超过500MB；',
      title2: 'DOC/DOCX/PDF',
    },
    {
      zddm: '99',
      title: '其他资料包除以上类型之外的资料文档。',
      title1: '附件最大不得超过500MB；',
      title2: 'JPG/PNG/DOC/DOCX/PDF',
    },
  ]

  uploadTitle.value = [
    {
      id: 14,
      zdxmc: 'fjlx',
      zdxid: '3',
      zddm: '1',
      zdmc: '平面图',
      sm: null,
      bz: '1,2',
      sfyx: null,
      cjsj: '2022-09-28 15:43:58',
      gxsj: '2022-09-28 15:43:58',
    },
    {
      id: 15,
      zdxmc: 'fjlx',
      zdxid: '3',
      zddm: '2',
      zdmc: '工艺图',
      sm: null,
      bz: '2',
      sfyx: null,
      cjsj: '2022-09-28 15:43:58',
      gxsj: '2022-09-28 15:43:58',
    },
    {
      id: 16,
      zdxmc: 'fjlx',
      zdxid: '3',
      zddm: '3',
      zdmc: '四色风险图',
      sm: null,
      bz: null,
      sfyx: null,
      cjsj: '2022-09-28 15:43:58',
      gxsj: '2022-09-28 15:43:58',
    },
    {
      id: 17,
      zdxmc: 'fjlx',
      zdxid: '3',
      zddm: '4',
      zdmc: '消防系统图',
      sm: null,
      bz: null,
      sfyx: null,
      cjsj: '2022-09-28 15:43:58',
      gxsj: '2022-09-28 15:43:58',
    },
    {
      id: 18,
      zdxmc: 'fjlx',
      zdxid: '3',
      zddm: '5',
      zdmc: '企业文档',
      sm: null,
      bz: null,
      sfyx: null,
      cjsj: '2022-09-28 15:43:58',
      gxsj: '2022-09-28 15:43:58',
    },
    {
      id: 19,
      zdxmc: 'fjlx',
      zdxid: '3',
      zddm: '6',
      zdmc: '历史事故案例',
      sm: null,
      bz: null,
      sfyx: null,
      cjsj: '2022-09-28 15:43:58',
      gxsj: '2022-09-28 15:43:58',
    },
    {
      id: 20,
      zdxmc: 'fjlx',
      zdxid: '3',
      zddm: '99',
      zdmc: '其他',
      sm: '其他消防车',
      bz: '1,2',
      sfyx: null,
      cjsj: '2022-09-28 15:43:58',
      gxsj: '2022-09-28 15:43:58',
    },
  ]

  uploadTitle.value.forEach((item: any, index: any) => {
    item.fjxxInfoListsf = []
    item.titles = arr[index]
  })

  // queryZdZdmcInfo({ key: 'fjlx' }).then((res: any) => {
  //   res.map((item: any, index: any) => {
  //     item.fjxxInfoListsf = []
  //     arr.map((i, idx) => {
  //       if (item.zddm == i.zddm) {
  //         item.titles = i
  //       }
  //     })
  //   })
  //   res.forEach((item: any, index: any) => {
  //     if (!item.titles) {
  //       res.splice(index, 1)
  //     }
  //   })
  //   uploadTitle.value = res
  // })
}
const queryQyxxInfoFrom = () => {
  //获取 企业信息 queryQyxxInfo
  const params_1 = {
    key: chemicalStore.qyInfo.id,
  }
  const params = {
    key: chemicalStore.qyInfo.id,
    ssid: chemicalStore.qyInfo.id,
  }
  queryQyxxInfo(params_1).then((res: any) => {
    if (res.sfzdwxy == null) {
      res.sfzdwxy = '1'
    }
    if (res.sfzdgy == null) {
      res.sfzdgy = '1'
    }
    if (res.sfzdhxp == null) {
      res.sfzdhxp = '1'
    }
    basicInfoForm.value = res
    querycylList(res.cylx)
    qymccopy.value = JSON.parse(JSON.stringify(basicInfoForm.value.qymc))
  })
  queryContactInfo(params).then((res: any) => {
    if (res.length == 0) {
      res = lxrInfoFormLest.list
    }
    lxrInfoForm.list = res
    // qyContactInfo.value = res.splice(0,10)
  })
}
//字典查询
const data_sfzdwxy = ref({})
const data_sfzdgy = ref({})
const data_sfzdhxp = ref({})

function dictionaries() {
  //查询是否是危险化学品重大危险源
  const params_sfzdwxy = {
    key: 'sfzdwxy',
  }
  queryZdZdmcInfo(params_sfzdwxy).then((res: any) => {
    data_sfzdwxy.value = res
  })
}
//查询是否是重点监管化工工艺
const params_sfzdgy = {
  key: 'sfzdgy',
}
queryZdZdmcInfo(params_sfzdgy).then((res: any) => {
  data_sfzdgy.value = res
})
function querycylx() {
  queryZdZdmcInfo({ key: 'cylx' }).then((res: any) => {
    CYLXOptions.value = res
    if (!basicInfoForm.value.cylx) {
      if (CYLXOptions.value.length > 0) {
        setTimeout(() => {
          basicInfoForm.value.cylx = res[0].zddm
          querycylList(res[0].zddm)
        }, 100)
      }
    }
  })
  //查询有无放射源
  const params_sfzdhxp = {
    key: 'sfzdhxp',
  }
  queryZdZdmcInfo(params_sfzdhxp).then((res: any) => {
    data_sfzdhxp.value = res
  })
}

const showForm = ref(true)

const showEditFactory = inject('showEditFactory')

const EditFactory = chemicalStore.productionStorage.EditFactory
// 取消关闭编辑窗口
const cancelClick = () => {
  chemicalStore.closeAllPSDialog() //关闭全部弹窗
  showEditFactory.value = false
}
function tabClick(type: any) {
  tabType.value = type
  if (type == 1) {
    showForm.value = true
  } else {
    showForm.value = false
  }
}
// 重置表单
const ruleFormRef = ref<FormInstance>()
const rules = reactive({
  rymc: [],
  ryyddh: [],
  ryzbdh: [],
})

const resetClick = (formRef) => {
  if (tabType.value == 1) {
    basicInfoForm.value.yqid = yqOptions.value[0].value
    basicInfoForm.value.qyjc = ''
    basicInfoForm.value.qydz = ''
    basicInfoForm.value.jyfw = ''
    basicInfoForm.value.cylx = CYLXOptions.value[0].zddm
    basicInfoForm.value.clsh = ''
    basicInfoForm.value.cylList = [cylOptions.value[0].zddm]
    basicInfoForm.value.cylMcList = []
    basicInfoForm.value.sfzdwxy = '1'
    basicInfoForm.value.sfzdgy = '1'
    basicInfoForm.value.sfzdhxp = '1'
    basicInfoForm.value.bz = ''
    cylOptions.value = []
    lxrInfoForm.list.forEach((item) => {
      item.rymc = ''
      item.ryyddh = ''
      item.ryzbdh = ''
      item.ryzw
    })
  }
  if (tabType.value == 2) {
    nextTick(() => {
      fileupload.value.removefiles()
    })
  }

  // basicInfoForm.value = {}
  // if (!formRef) {
  //   return
  // }
  // formRef.resetFields()
}
const requiredNameArr = [
  'yqid',
  'qydz',
  'jyfw',
  'cylx',
  'clsh',
  'sfzdwxy',
  'sfzdgy',
  'sfzdhxp',
  'rymc',
  'ryyddh',
  'ryzbdh',
]
// 新增单位 insertOrUpdateQyxx
const addinsertOrUpdateQyxx = () => {
  const params_2 = {
    bz: '',
    cjr: '',
    cqmc: 'test',
    fhdg: 0,
    fhdmj: 0,
    fjxxInfoList: [
      {
        bz: '',
        cjr: '',
        fjdz: '',
        fjlx: 0,
        fjmc: '',
        gxr: '',
        id: '',
        qyid: chemicalStore.qyInfo.id,
        sfyx: 1,
        ssid: '',
      },
    ],
    fzrxxInfoList: [
      {
        bz: '',
        cjr: '',
        gxr: '',
        id: '',
        qyid: chemicalStore.qyInfo.id,
        rymc: '',
        rysx: 0,
        ryyddh: '',
        ryzbdh: '',
        ryzw: '',
        sfyx: 1,
        ssid: '',
      },
    ],
    gqjj: '',
    gxr: '',
    gxsj: '',
    id: '',
    qyid: chemicalStore.qyInfo.id,
    sfyx: 1,
    syzt: 0,
    wxydj: 0,
  }

  insertOrUpdateQyxx({ ...basicInfoForm.value, sfyx: 1 }).then((res: any) => {
    emitter.emit('uploadHandler')
  })
  const qyid = basicInfoForm.value.id
  lxrInfoForm.list.forEach((item) => {
    item.qyid = qyid
    item.ssid = qyid
    item.sfyx = 1
  })
  console.log(props.qyContactInfo)
  insertOrUpdateLxrxx(lxrInfoForm.list).then((res: any) => {
    emitter.emit('uploadfile')
  })
  ElMessage.success('企业信息保存成功')
}

//保存按钮
const saveClick = () => {
  //如果已经标注过，需要修改地图要素的标注名称
  if (basicInfoForm.value.sfbh === 1) {
    window.GScrollWallArray.forEach((item: any) => {
      if (item.name === basicInfoForm.value.id) {
        item.scrollwallLabel.feature3D.setText(basicInfoForm.value.qymc)
      }
    })
  }
  // let flag = false
  // for (const key in basicInfoForm.value) {
  //   if (requiredNameArr.includes(key) && !basicInfoForm.value[key]) {
  //     console.log(key, '字段未填写')
  //     flag = true
  //   }
  // }
  // lxrInfoForm.list.forEach((item) => {
  //   for (const key in item) {
  //     if (requiredNameArr.includes(key) && !item[key]) {
  //       console.log(key, '字段未填写')
  //       flag = true
  //     }
  //   }
  // })
  // if (flag) {
  //   return (chemicalStore.FormCheckConfirmShow = true)
  // }
  const isflg = false

  if (!checkNumberTypeAndLength(lxrInfoForm.list[0].ryyddh, '手机号', 11)) {
    return
  } else if (!checkNumberTypeAndLength(lxrInfoForm.list[1].ryyddh, '手机号', 11)) {
    return
  } else if (!checkNumberTypeAndLength(lxrInfoForm.list[2].ryyddh, '手机号', 11)) {
    return
  } else if (!checkNumberTypeAndLength(lxrInfoForm.list[3].ryyddh, '手机号', 11)) {
    return
  } else if (!checkNumberTypeAndLength(lxrInfoForm.list[4].ryyddh, '手机号', 11)) {
    return
  } else if (!checkNumberTypeAndLength(lxrInfoForm.list[5].ryyddh, '手机号', 11)) {
    return
  }

  if (!isflg) {
    //从新获取企业信息
    addinsertOrUpdateQyxx()
    Updatefjxx()
    chemicalStore.closeAllPSDialog() //关闭全部弹窗
    queryQyxxInfoFrom()
    showEditFactory.value = false
  }

  // emit('uploadHandler')
}

//编辑查询附件
function queryfjxxList() {
  const param = {
    ssid: chemicalStore.qyInfo.id,
    key: chemicalStore.qyInfo.id,
  }
  queryfjList(param).then((res) => {
    nextTick(() => {
      setTimeout(() => {
        uploadTitle.value.map((i) => {
          res.map((item) => {
            if (item.fjlx == i.zddm) {
              i.fjxxInfoListsf.push(item)
            }
          })
        })
      }, 100)
    })
    console.log(1111111)
    // fileupload.value.fjxxInfoListsf = xfbfxxData._value.fjxxInfoList
  })
}
//附件信息保存
function Updatefjxx() {
  const arr = []
  if (fjxxInfoList.value.length != 0) {
    fjxxInfoList.value.map((item) => {
      item.fjxxInfoListsf.map((i) => {
        arr.push(i)
      })
    })
  } else {
    uploadTitle.value.map((item) => {
      item.fjxxInfoListsf.map((i) => {
        arr.push(i)
      })
    })
  }
  insertOrUpdatefjxx(arr).then((res) => {
    ElMessage.success('企业信息附件保存成功')
  })
}

function queryyqDate() {
  const cjid = window.localStorage.getItem('jgId')
  const param = {
    jgId: cjid,
  }
  queryyqList(param).then((res) => {
    yqOptions.value = res
    if (!basicInfoForm.value.yqid) {
      if (yqOptions.value.length > 0) {
        setTimeout(() => {
          basicInfoForm.value.yqid = res[0].value
        }, 100)
      }
    }
  })
}
// !附件处理
// function clickFileHandle() {
//   fileupload.value.fjxxInfoListsf = xfbfxxData._value.fjxxInfoList
// }

function uploadDelete(val: any) {
  fjxxInfoList.value = val
}

function uploadCuccess(val: any) {
  fjxxInfoList.value = val
}
function selectHandler(val: any) {
  basicInfoForm.value.cylList = []
  querycylList(val)
}
function querycylList(val) {
  val = val ? val : ''
  const param = {
    cylxdm: val,
  }
  querycyl(param).then((res) => {
    cylOptions.value = res
    if (!basicInfoForm.value.cylList) {
      if (cylOptions.value.length > 0) {
        setTimeout(() => {
          basicInfoForm.value.cylList = [res[0].zddm]
        }, 100)
      }
    }
  })
}
onMounted(() => {
  dictionaries()
  queryQyxxInfoFrom()
  querycylx()
  queryyqDate()
  queryfjxxList()
  queryxk()
})
// defineExpose({ clickFileHandle })
</script>
<style lang="less">
.banner {
  margin-bottom: 20px;
  border-bottom: 1px solid #6d6d6d;
  height: 30px;

  div {
    .active {
      height: 30px;
      line-height: 30px;
      font-weight: 700;
      background-color: rgba(26, 137, 145, 0.8);
    }

    span {
      display: inline-block;
      width: 80px;
      height: 25px;
      line-height: 25px;
      border-radius: 5px 5px 0 0;
      vertical-align: bottom;
      text-align: center;
      background: rgba(109, 109, 109, 0.7);
      color: #fff;
      font-size: 16px;

      &:hover {
        cursor: pointer;
      }

      &:nth-child(1) {
        margin-right: 5px;
      }
    }
  }
}
// .el-select-dropdown__item.hover,
// .el-select-dropdown__item:hover {
//   background: rgba(0, 141, 146, 1);
// }
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected.hover {
  background: rgba(0, 141, 146, 1);
}
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
  background: rgba(1, 7, 17, 0.7);
}
.zdwxy,
.jghggy,
.wxhxp {
  .el-form-item__label {
    width: 235px !important;
  }
}
.cylclass {
  .el-tag {
    background-color: rgba(0, 0, 0, 0);
    color: #fff;
  }
  .el-select .el-select__tags .el-tag--info {
    background-color: rgba(0, 0, 0, 0);
  }
}
</style>
